<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta content="最热前端框架,爱尚博客,前端趋势,微信小程序制作,小程序教程,前端怎么做app,app制作,网站开发,靠谱的网站开发,app开发,小程序开发,小程序开发多少钱,app开发多少钱,网站开发多少钱"
        name="Keywords">
    <meta name="description" content="爱尚博客-让前端萌新少走弯路的博客！" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
    <title>爱尚博客-爱尚前端</title>
    <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.css">
    <script src="../common/public.js"></script>
    <link rel="stylesheet" href="../common/m.css">
    <link rel="stylesheet" href="../assets/css/search.css">
</head>

<body>

    <div class="box" v-cloak>
        <!-- 导航 -->
        <header>
            <div class="logo">爱尚博客</div>
            <div class="navs">
                <a :href="item.url" v-for="(item,index) in nav" :key="item.Id" v-cloak>{{item.name}}</a>
            </div>
            <!-- 小屏幕nav -->
            <mu-menu cover placement="bottom-end" :open.sync="open">
                <mu-button icon>
                    <mu-icon value="menu"></mu-icon>
                </mu-button>
                <mu-list slot="content">
                    <mu-list-item button v-for="(item,index) in nav" :key="item.Id" :href="item.url">
                        <mu-list-item-title>
                            {{item.name}}
                        </mu-list-item-title>
                    </mu-list-item>
                </mu-list>
            </mu-menu>
            <!-- 小屏幕nav -->
        </header>
        <!-- 导航 -->
        <!-- 主体 -->
        <article>
            <section>
                <div class="search">
                    <mu-text-field type="text" placeholder="请输入关键字..." action-icon="search" full-width :action-click="() => (search(value1))"
                        v-model="value1" @keyup.enter="search(value1)"></mu-text-field>
                </div>
                <mu-load-more ref="container" @refresh="refresh" :refreshing="refreshing" :loading="loading" @load="load"
                    :loaded-all="loaded_all">
                    <mu-list>
                        <template>
                            <mu-container v-for="(items,index) in item" :key="items.Id">
                                <mu-card style="width:100%;">
                                    <a :href="items.href" target="_blank">
                                        <mu-card-media>
                                            <img :src="items.book_img" class="img">
                                        </mu-card-media>
                                        <mu-card-title :title="items.title" :sub-title="items.timer"></mu-card-title>
                                    </a>
                                    <mu-divider></mu-divider>
                                    <mu-card-actions>
                                        <mu-button flat class="primary" @click.native="like_click(index,items.Id)">
                                            <div class="like">
                                                <!-- 点赞 -->
                                            </div>
                                        </mu-button>
                                        <mu-button flat @click.native="gift_click(index,items.Id)">
                                            <div class="gift">
                                                <!-- 打赏 -->
                                            </div>
                                        </mu-button>
                                    </mu-card-actions>
                                </mu-card>
                            </mu-container>
                        </template>
                    </mu-list>
                </mu-load-more>
            </section>
            <!-- 侧边 -->
            <aside>
                <mu-container>
                    <mu-expansion-panel :expand="expands">
                        <div slot="header">标签</div>
                        <mu-button color="primary" v-for="(item,index) in tag" :key="item.Id" v-cloak>{{item.name}}</mu-button>
                    </mu-expansion-panel>
                    <mu-expansion-panel :expand="expands">
                        <div slot="header">爱尚博客小程序</div>
                        <img src="../image/xcx.jpg" alt="爱尚博客小程序">
                    </mu-expansion-panel>
                    <mu-expansion-panel :expand="expands">
                        <div slot="header">最近更新</div>
                        <mu-list>
                            <mu-tooltip :content="set_tips(item.timer,1)" v-for="(item,index) in new_items" :key="item.Id"
                                placement="top">
                                <a :href="item.href" target="_blank">
                                    <mu-list-item button :ripple="false">
                                        <mu-list-item-action v-cloak>
                                            {{index+1}}
                                        </mu-list-item-action>
                                        <mu-list-item-title v-cloak>{{item.title}}</mu-list-item-title>
                                    </mu-list-item>
                                </a>
                            </mu-tooltip>
                        </mu-list>
                    </mu-expansion-panel>
                    <mu-expansion-panel :expand="expands">
                        <div slot="header">查看最多</div>
                        <mu-list>
                            <mu-tooltip :content="set_tips(item.look_num)" v-for="(item,index) in hot_items" :key="item.Id"
                                placement="top">
                                <a :href="item.href" target="_blank">
                                    <mu-list-item button :ripple="false">
                                        <mu-list-item-action v-if="index <= 2">
                                            <mu-badge :content="index+1" color="secondary"></mu-badge>
                                        </mu-list-item-action>
                                        <mu-list-item-action v-if="index > 2">
                                            <mu-badge :content="index+1"></mu-badge>
                                        </mu-list-item-action>
                                        <mu-list-item-title v-cloak>{{item.title}}</mu-list-item-title>
                                    </mu-list-item>
                                </a>
                            </mu-tooltip>
                        </mu-list>
                    </mu-expansion-panel>
                    <mu-expansion-panel :expand="expands">
                        <div slot="header">看个广告</div>
                        <mu-carousel transition="fade" v-if="ad_data">
                            <mu-carousel-item v-for="(item,index) in ad_data" :key="item.Id">
                                <a :href="item.href">
                                    <img :src="item.ad_img" :alt="item.name">
                                </a>
                            </mu-carousel-item>
                        </mu-carousel>
                    </mu-expansion-panel>
                </mu-container>
            </aside>
            <!-- 侧边 -->
            <!-- 底部 -->
            <footer>
                <div class="link">
                    友情链接：
                    <a :href="item.url" v-for="(item,index) in links" :key="item.Id" :title="item.beizhu" target="_blank">
                        <mu-button color="primary" flat v-cloak>{{item.name}}</mu-button>
                    </a>
                </div>
                <div class="footer_bm">
                    <p>
                        <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=44011802000140&token=da834af7-3426-45c3-b0b6-437f55b4aa7d"
                            target="_blank" title="粤公网安备-44011802000140号"><img src="http://www.aijiumai.cn/image/beianbgs.png"
                                alt="粤公网安备-44011802000140号" width="30px" height="30px"> 粤公网安备-44011802000140号</a>
                        &nbsp;
                        <a href="http://www.miitbeian.gov.cn/" target="_blank" title="粤ICP备15074775">粤ICP备15074775号-1</a>
                    </p>
                    <p>
                        © 爱尚博客 &nbsp;<a href="http://www.aijiumai.cn">www.aijiumai.cn</a> &nbsp;
                        <a href="../sitemap.xml">网站地图</a>
                    </p>
                </div>
            </footer>
            <!-- 底部 -->
        </article>
        <!-- 主体 -->

        <!-- 弹框 -->
        <mu-container v-show="openSimple">
            <mu-dialog title="温馨提示" width="360" :open.sync="openSimple">
                {{msgs}}
                <mu-button slot="actions" flat color="primary" @click="closeSimpleDialog">知道了</mu-button>
            </mu-dialog>
        </mu-container>
        <!-- 弹框 -->
        <!-- 打赏 -->
        <mu-container v-if="openAlert">
            <mu-dialog title="支持一下下嘛?" width="450" max-width="80%" :esc-press-close="false" :overlay-close="false"
                :open.sync="openAlert">
                <img src="../image/3q.png" alt="">
                <mu-button slot="actions" flat color="primary" @click="closeAlertDialog">考虑一下</mu-button>
                <mu-button slot="actions" flat color="primary" @click="closeAlertDialog">我不！</mu-button>
            </mu-dialog>
        </mu-container>
        <!-- 打赏 -->
    </div>
</body>
<script src="../common/v.js"></script>
<script src="../common/a.js"></script>
<script src="../common/m.js"></script>
<script src="../assets/js/search.js"></script>

</html>